<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <title>Untitled Document</title>
        <link rel="stylesheet" type="text/css" href="./js/dijit/themes/tundra/tundra.css"/>
        <style type="text/css">
            #container {
                border: 1px solid green;
                width: 960px;
                height: 600px;
            }
        </style>
    </head>
    <body  class="tundra">
        <div id="container">
            <div id="menu">
            </div>
			<div id="menuII">
				
			</div>
        </div>
    </body>
</html>
<script src="./js/dojo/dojo.js">
</script>
<script type="text/javascript">
    
    dojo.ready(function(){
        dojo.require("dijit.form.Button");
        dojo.require("dijit.Menu");
            var menu = new dijit.Menu({
                style: "display: none;"
            });
            var menuItem1 = new dijit.MenuItem({
                label: "Yahoo",
                onClick: function(){
                    console.log('hi');
                }
            });
            menu.addChild(menuItem1);
            
            var menuItem2 = new dijit.MenuItem({
                label: "Google",
                onClick: function(){
                    console.log('ho');
                }
            });
            menu.addChild(menuItem2);
            
            var button = new dijit.form.ComboButton({
                label: "get all mail",
                dropDown: menu
            });
            dojo.byId("menu").appendChild(button.domNode);
			
			
			var menu = new dijit.Menu({
            style: "display: none;"
        });
		
		
        var menuItem1 = new dijit.MenuItem({
            label: "Save",
            iconClass: "dijitEditorIcon dijitEditorIconSave",
            onClick: function() {
                console.log('save');
            }
        });
        menu.addChild(menuItem1);

        var menuItem2 = new dijit.MenuItem({
            label: "Cut",
            iconClass: "dijitEditorIcon dijitEditorIconCut",
            onClick: function() {
                console.log('cut');
            }
        });
		
		var menuItem3 = new dijit.MenuItem({
            label: "Paste",
            iconClass: "dijitEditorIcon dijitEditorIconPaste",
            onClick: function() {
                console.log('paste');
            }
        });
		
		var menuItem4 = new dijit.MenuItem({
            label: "Delete",
            iconClass: "dijitEditorIcon dijitEditorIconDelete",
            onClick: function() {
                console.log('delete');
            }
        });
		
        menu.addChild(menuItem2);
        menu.addChild(menuItem3);
        menu.addChild(menuItem4);

        var button = new dijit.form.DropDownButton({
            label: "hello!",
            name: "programmatic2",
            dropDown: menu,
            id: "progButton"
        });
        dojo.byId("menuII").appendChild(button.domNode);
       
    });
    
    
    dojo.ready(function(){
        /*
         * it's the best to perform the parse time, in case we'll manipulate the dom before doc ready
         */
        dojo.parser.parse();
    });
</script>
